<template>
  <div class="list">
    <div>
      <div class="goodsActivity">
        <div class="actTitle">活动专区</div>
        <goodsActivity name="goodsActivity"></goodsActivity>
      </div>
      <div class="goodsList">
        <div class="listTitle">热销商品</div>
        <goodsList name="goodsList"></goodsList>
      </div>
    </div>
  </div>
</template>

<script>
import goodsList from '@/pages/GoodsList' //商品列表界面
import goodsActivity from '@/components/GoodsActivity' //获取商品组件
export default {
  name: 'list',
  data() {
    return {
    }
  },
  components: { goodsList, goodsActivity },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.goodsActivity {
  width: 18%;
  float: left;
  border: solid 2px black;
}
.goodsList {
  border: solid 2px black;
  width: 80%;
  float: left;
}

.actTitle {
  line-height: 50px;
  text-align: center;
  background-color: yellow;
}

.listTitle {
  line-height: 50px;
  text-align: center;
  background-color: yellow;
}
</style>
